{% extends 'base.html' %}
{% block title %}
    <title>推荐</title>
{% endblock %}

{% block body %}
    <h1>这里是推荐</h1>
    <button type="button" class="btn btn-success load">换一批</button>
    <ul class="list-group items">
        
      </ul>
{% endblock %}
{% block js %}
<script>
    function load_data(){
        console.log("加载数据");
        $.ajax({
            url:"/load_data",
            // 不更改数据库使用get
            method:"get",
            success:function(data){
                $('.items').empty();
                for(let i=0; i<data.data.length;i++){
                    $('.items').append(`<li class="list-group-item">
                        <a href="/detail/${data.data[i].id}">${data.data[i].title}</a>
                        </li>`)
                }

            }
        })
    }

 $(function(){
    load_data()
    $(".load").click(function(){
        console.log("切换");
    })

 })
</script>
{% endblock %}